import React                from 'react';
import {connect}            from "react-redux";

import Empty                from '../../components/form/Empty';
import PullUp               from '../../components/form/PullUp';
import Pagination           from '../../components/Pagination';
import {Token}              from "../../utils/Storage";
import {loadRecords}        from "../../actions/cart";
import './records.scss';

class Records extends Pagination {

    _method = () => 'loadRecords';

    componentWillMount(){
        if(Token.isActive()){
            this.load();
        }
    }

    render(){
        var {list} = this.state;
        return (
            <div className="records">
                <Empty list={list} type="record">
                    <PullUp load={this.reload.bind(this)}>
                        {list.map(m =>
                            <div key={m.id} className="r-item flex-avg">
                                <div className="ri-left">
                                    <div>{m.name}</div>
                                    <div>兑换时间：{m.time}</div>
                                    <div>兑换数量：{m.count}</div>
                                </div>
                                <div className="ri-right flex-avg">
                                    <div>已兑积分</div>
                                    <div>{m.accumulate}</div>
                                </div>
                            </div>
                        )}
                    </PullUp>
                </Empty>
            </div>
        );
    }

}

export default connect(undefined, {loadRecords})(Records);
